/* reset */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  body {
    height: 100vh;
    overflow: hidden;
    font-size: var(--zc-base-font-size);
    color: var(--zc-base-text-color);
  }
}

#app {
  width: 100vw;
  height: 100vh;

  &:not([class*='el-scrollbar']) {
    transition: var(--el-transition);
  }
}

.el-row {
  margin: 0 !important;
}

/* 主内容区域 */
.zc-main-container {
  height: auto;
  min-height: 100%;
  width: 100%;
  background-color: var(--el-bg-color);
  box-shadow: var(--zc-box-shodow-lighter);
  border: 1px solid var(--el-border-color-light);
  padding: var(--zc-padding-20);
}

/* 自定义全局滚动条样式 */
::-webkit-scrollbar {
  width: 8px; /* 滚动条宽度 */
  height: 50px; /* 滚动条高度 */
}

::-webkit-scrollbar-track {
  background: var(--el-fill-color-light); /* 滚动条轨道背景色 */
}

::-webkit-scrollbar-thumb {
  background: var(--el-color-info-light-5); /* 滚动条滑块背景色 */
  border-radius: 4px; /* 滚动条滑块圆角 */
}

::-webkit-scrollbar-thumb:hover {
  background: var(--el-color-info-light-7); /* 滚动条滑块悬停背景色 */
}

/* zcnprogress-custom.scss */
#nprogress .bar {
  background: var(--el-color-primary) !important; // 自定义进度条颜色
}

#nprogress .peg {
  box-shadow:
    0 0 10px var(--el-color-primary),
    0 0 5px var(--el-color-primary) !important; // 自定义进度条阴影
}

#nprogress .spinner-icon {
  border-top-color: var(--el-color-primary) !important; // 自定义旋转图标颜色
  border-left-color: var(--el-color-primary) !important; // 自定义旋转图标颜色
}
